@use '@material/chips/deprecated' as mdc-chips;
@use '@material/theme/theme-color' as mdc-theme-color;
@use 'sass:color';
@use 'sass:map';
@use '../mdc-helpers/mdc-helpers';
@use '../../material/core/theming/theming';

@mixin _selected-color($color) {
  @include mdc-chips.fill-color($color, $query: mdc-helpers.$mat-theme-styles-query);
  @include mdc-chips.ink-color(text-primary-on-dark, $query: mdc-helpers.$mat-theme-styles-query);
  @include mdc-chips.selected-ink-color-without-ripple_(
                  text-primary-on-dark,
                  $query: mdc-helpers.$mat-theme-styles-query
  );
  @include mdc-chips.leading-icon-color(text-primary-on-dark,
    $query: mdc-helpers.$mat-theme-styles-query);
  @include mdc-chips.trailing-icon-color(text-primary-on-dark,
    $query: mdc-helpers.$mat-theme-styles-query);
}

@mixin color($config-or-theme) {
  $config: theming.get-color-config($config-or-theme);
  $primary: theming.get-color-from-palette(map.get($config, primary));
  $accent: theming.get-color-from-palette(map.get($config, accent));
  $warn: theming.get-color-from-palette(map.get($config, warn));
  $background: map.get($config, background);
  $unselected-background: theming.get-color-from-palette($background, unselected-chip);

  // Save original values of MDC global variables. We need to save these so we can restore the
  // variables to their original values and prevent unintended side effects from using this mixin.
  $orig-mdc-chips-fill-color-default: mdc-chips.$fill-color-default;
  $orig-mdc-chips-ink-color-default: mdc-chips.$ink-color-default;
  $orig-mdc-chips-icon-color: mdc-chips.$icon-color;

  @include mdc-helpers.mat-using-mdc-theme($config) {
    mdc-chips.$fill-color-default:
        color.mix(mdc-theme-color.prop-value(on-surface), mdc-theme-color.prop-value(surface), 12%);
    mdc-chips.$ink-color-default: rgba(mdc-theme-color.prop-value(on-surface), 0.87);
    mdc-chips.$icon-color: mdc-theme-color.prop-value(on-surface);

    @include mdc-chips.set-core-styles($query: mdc-helpers.$mat-theme-styles-query);
    @include mdc-chips.without-ripple($query: mdc-helpers.$mat-theme-styles-query);

    .mat-mdc-chip {
      @include mdc-chips.fill-color-accessible($unselected-background,
        $query: mdc-helpers.$mat-theme-styles-query);

      // mdc-chip-fill-color-accessible includes mdc-chip-selected-ink-color which overrides the
      // opacity so selected chips always show a ripple.
      // Include the same mixins but use mdc-chip-selected-ink-color-without-ripple
      &.mat-primary {
        &.mdc-chip--selected, &.mat-mdc-chip-highlighted {
          @include _selected-color($primary);
        }
      }

      &.mat-accent {
        &.mdc-chip--selected, &.mat-mdc-chip-highlighted {
          @include _selected-color($accent);
        }
      }

      &.mat-warn {
        &.mdc-chip--selected, &.mat-mdc-chip-highlighted {
          @include _selected-color($warn);
        }
      }
    }
  }

  // Restore original values of MDC global variables.
  mdc-chips.$fill-color-default: $orig-mdc-chips-fill-color-default;
  mdc-chips.$ink-color-default: $orig-mdc-chips-ink-color-default;
  mdc-chips.$icon-color: $orig-mdc-chips-icon-color;
}

@mixin typography($config-or-theme) {
  $config: theming.get-typography-config($config-or-theme);
  @include mdc-chips.set-core-styles($query: mdc-helpers.$mat-typography-styles-query);
  @include mdc-helpers.mat-using-mdc-typography($config) {
    @include mdc-chips.without-ripple($query: mdc-helpers.$mat-typography-styles-query);
  }
}

@mixin density($config-or-theme) {
  $density-scale: theming.get-density-config($config-or-theme);
  .mat-mdc-chip {
    @include mdc-chips.density($density-scale, $query: mdc-helpers.$mat-base-styles-query);
  }
}

@mixin theme($theme-or-color-config) {
  $theme: theming.private-legacy-get-theme($theme-or-color-config);
  @include theming.private-check-duplicate-theme-styles($theme, 'mat-mdc-chips') {
    $color: theming.get-color-config($theme);
    $density: theming.get-density-config($theme);
    $typography: theming.get-typography-config($theme);

    @if $color != null {
      @include color($color);
    }
    @if $density != null {
      @include density($density);
    }
    @if $typography != null {
      @include typography($typography);
    }
  }
}

